<template>
  <div>
    <h2>投资显示列表</h2>
    <table>
      <tr>
        <td>
          投资名称<input type="text" >
          投资总额度<input type="text" >
          ——<input type="text" v-model="chaxun.pricecount">
          <input type="button" value="查询" @click="xian1">
        </td>
      </tr>
    </table>
    <table class="table table-bordered">
      <thead>
        <tr>
          <td>投资编号</td>
          <td>投资名称</td>
          <td>投资总额度</td>
          <td>已投资额度</td>
          <td>剩余额度</td>
          <td>投资人数</td>
          <td>操作</td>
        </tr>
      </thead>
      <tbody>
        <tr v-for="em in info" :key="em.tid">
          <td>{{ em.tid }}</td>
          <td>{{ em.tname }}</td>
          <td>{{ em.pricecount }}</td>
          <td>{{ em.priceyitou }}</td>
          <td>{{ em.priceshengyu }}</td>
          <td>{{ em.tnum }}</td>
          <td><input type="button" value="删除">
            <input type="button" value="修改"></td>
        </tr>
      </tbody>
    </table>

  </div>
</template>

<script setup lang="ts">
import{ref,onMounted} from 'vue'
import axios from 'axios'
import{useRouter} from 'vue-router' 
let  router=useRouter();

const chaxun=ref({
  tname:"",
  pricecount:"",
})
const info=ref([{
  tid:1,
  tname:"",
  pricecount:"",
  priceyitou:"",
  priceshengyu:"",
  tnum:""
}])

//钩子函数
onMounted(()=>{
  xian();
})
// //查询
const xian1=()=>{
  xian();
}
//显示
const xian=()=>{
  axios({
    url:"http://localhost:50462/api/CF/show",
    method:"get",
    params:
    {
      tname:chaxun.value.tname,
      pricecount:chaxun.value.pricecount||0,
    }
  }).then((res)=>{
    info.value=res.data;
    console.log(info.value);
  }).catch((err)=>{
    console.log(err);
  })
}

</script>

<style scoped>

</style>